<template>

  <div class="inside_page inside_news" :style="{backgroundColor:app_tabBar.config.bodybgcolor}">
    <banner></banner>
    <subcolumn-nav :column_id="column.news.bigclass" @resetPage="resetPage"></subcolumn-nav>
      <list-page :config="config"></list-page>
      <div class="btn no-more" v-if="page_config.is_more" @click="getMore" :style="{backgroundColor:app_tabBar.config.thirdcolor}">点击加载更多</div>
      <div class="no-more" v-if="!page_config.is_more && news_list.length>0" :style="{backgroundColor:app_tabBar.config.thirdcolor}">
        <span class="text">没有更多了</span>
      </div>
  </div>
</template>
<script>
import Banner from '@/components/common/Banner'
import SubcolumnNav from '@/components/common/SubcolumnNav'
import ListPage from '@/components/common/ListPage'
import { fetchListPage, getMoreList } from '@/utils/index'
import { mapGetters } from 'vuex'
export default {
  components: {
    Banner,
    SubcolumnNav,
    ListPage,
  },
  mounted() {
    this.loading = true
    if (!this.app_tabBar.index) {
      this.$store.dispatch('GetTabBar').then(response => {
        fetchListPage(this.column.news, this)
      })
    } else {
      fetchListPage(this.column.news, this)
    }
  },
  computed: {
    ...mapGetters(['app_tabBar', 'app_viewHeight', 'news_list', 'column'])
  },
  data() {
    return {
      isLoad: true,
      loading: true,
      config: {
        type: 'product',
        style: ''
      },
      page_config: {
        page: 0,
        page_num: 0,
        is_more: true
      }
    }
  },
  methods: {
    getMore() {
      if (this.isLoad) {
        getMoreList('news', this)
      } else {
        console.log('please wait')
      }
    },
    resetPage(data) {
      this.page_config = data
    }
  }
}
</script>
